<template>
    <div>
        <el-form size="default">
            <el-form-item label="点击后手动刷新一次代码查重">
                <el-button @click="checkduplicate" type="primary">代码查重</el-button>
            </el-form-item>
            <el-form-item label="点击后重新跑一次学员代码的评分结果，并可指定O2等重跑选项">
                <el-button @click="dialogVisible = true" type="primary">重新运行学员代码</el-button>
            </el-form-item>
            <el-form-item label="重新刷新排行榜">
                <el-button @click="runranking" type="primary">重新刷新排行榜</el-button>
            </el-form-item>
            <el-form-item label="点击后下载比赛中所有学员提交的代码">
                <el-button @click="downloadcode" type="primary">下载提交代码</el-button>
            </el-form-item>

            <el-form-item label="点击后查看比赛题目为PDF文件，并可下载">
                <el-button plain type="primary">
                    <a target="_blank" :href="`/question.html?activityid=${p.data.ID}`" type="primary">保存比赛为pdf</a>
                </el-button>

            </el-form-item>
            <el-form-item label="点击后下载该比赛所有题目的markdown文件、测试点">
                <el-button @click="_downloadmatchquestion">
                    下载比赛题目
                </el-button>

            </el-form-item>
            <el-form-item v-if="data.file">
                <el-button plain type="primary">
                    <a target="_blank" :href="data.file">下发文件下载</a>
                </el-button>
                {{ data.file }}
            </el-form-item>
        </el-form>


        <el-dialog v-model="dialogVisible" title="Tips" width="800">
            <el-row>
                <el-col :span="12">
                    <el-form :model="runactivityform" label-width="auto">
                        <el-form-item label="是否使用缓存">
                            <el-switch v-model="runactivityform.iscatch" />
                        </el-form-item>
                        <el-form-item label="是否运行已运行过的">
                            <el-switch v-model="runactivityform.isinfo" />
                        </el-form-item>
                        <el-form-item label="是否开启O2">
                            <el-switch v-model="runactivityform.iso2" />
                        </el-form-item>
                        <el-form-item label="选择运行的学员">
                            <el-select v-model="runactivityform.userid" collapse-tags multiple filterable class="m-2"
                                clearable placeholder="Select">
                                <el-option v-for="item in users" :key="item?.ID" :label="item?.name"
                                    :value="Number(item?.ID)" />
                            </el-select>
                        </el-form-item>
                        <el-form-item label="重新运行学员代码">
                            <el-button type="primary" :disabled="disabled" @click="runactivity">
                                重新运行学员代码
                            </el-button>
                        </el-form-item>
                    </el-form>
                </el-col>
                <el-col :span="12">
                    <div>运行状态</div>
                    <el-progress type="circle" v-if="runactivityoption.length"
                        :percentage="(runactivityoption.length - runactivityoption.index) / runactivityoption.length * 100">
                        <span class="percentage-value">{{ runactivityoption.length - runactivityoption.index }} / {{
                            runactivityoption.length }}</span>
                    </el-progress>
                    <div v-else>
                        此比赛暂无运行任务
                    </div>
                </el-col>

            </el-row>

            <template #footer>
                <span class="dialog-footer">
                    <el-button type="primary" @click="dialogVisible = false">
                        关闭
                    </el-button>
                </span>
            </template>
        </el-dialog>
    </div>
</template>

<script lang="ts" setup>
import { ElMessage, ElMessageBox } from 'element-plus';
import { saveAs } from 'file-saver';
import jszip from 'jszip';
import { uniq } from 'underscore';
import { computed, inject, onMounted, reactive, ref, Ref } from 'vue';
import { useStore } from 'vuex';
import { asynccheckduplicate, asyncgetusermatchcode, asyncrunactivity, asyncrunranking } from '../../../api';
import { Irunactivityoption, Storekey } from '../../../interface';
import Studycodemodel from '../../../mysql_interface/studycodemodel';
import { downloadmatchquestion } from '../../../util/updateoss';
const p = defineProps<{ data: Studycodemodel.Iactivity }>()
const loading = ref(false)
async function _downloadmatchquestion() {
    loading.value = true
    downloadmatchquestion(p, true)
    loading.value = false
}

const dialogVisible = ref(false)
const store = useStore(Storekey)

const runactivityoptions = inject<Ref<Irunactivityoption[]>>('runactivityoptions')

const users = computed(() => {
    const t1 = p.data.activityuser?.map(c => c.user) || []
    const t2 = p.data.team?.user
    const t3 = p.data.team?.teamuser?.map(c => c.user) || []
    return uniq(t1.concat(t2).concat(...t3).filter(c => c), e => {
        return e?.ID
    })
})

const disabled = computed(() => {
    if (runactivityoption.value.index) {
        if (runactivityoption.value.index === 1) {
            return false
        }
        return true
    }
    return false
})

const runactivityoption = computed(e => {
    return runactivityoptions?.value?.find(e => e.activityid === p.data.ID) || {
        "activityid": p.data.ID,
        "index": 0,
        "length": 0
    }
})

onMounted(() => {
    activityprocess()
})

function activityprocess() {
    store.state.socket.emit('activityprocess', p.data.ID)
}

function checkduplicate() {
    ElMessageBox.confirm("确定要进行查重?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "error",
    }).then(async () => {
        asynccheckduplicate({ activityid: p.data.ID }).then(e => {
            ElMessage.success('查重完成')
        }).catch(e => {
            ElMessage.error(e)
        })
    }).catch(e => {
        ElMessage.info('已取消')
    })
}

function downloadcode() {
    asyncgetusermatchcode({ activityid: p.data.ID }).then(data => {
        const zip = new jszip()
        data.forEach(a => {
            zip.file(a[0], a[1])
        })
        zip.generateAsync({ type: "blob" }).then(e => {
            console.log(e)
            saveAs(e, '代码.zip')
        })
    }).catch(e => {
        ElMessage.error(e)
    })
}




const runactivityform = reactive<{
    ID: number;
    iscatch?: boolean | undefined;
    isinfo?: boolean | undefined;
    iso2?: boolean | undefined;
    userid?: number[] | undefined;
}>({
    iscatch: true,
    isinfo: true,
    iso2: true,
    userid: [],
    ID: Number(p.data.ID)
})

async function runactivity() {
    await asyncrunactivity(runactivityform)
    activityprocess()

}

async function runranking() {
    await asyncrunranking({ ID: p.data.ID })


}

</script>

<style scoped>
a {
    color: var(--el-text-color-regular);
}

.el-button:hover a {
    color: #fff;

}
</style>